page{
    width: 100vw;
    height: 100vh;
}
.category{
    width: 100%;
    height: 100%;
    .cates{
        display: flex;
        height: ~'calc(100vh - 90rpx)';
        //滚动区域的高度等于 视口 高度减去 顶部的搜索框的高度
        .left_menu_list{
            // flex 布局会默认继承父元素高度
            flex: 3;
            background-color: #F6F6F6;
            color: #9D9D9D;
            .menu_item{
                display: flex;
                justify-content: center;
                align-items: center;
                height: 80rpx;;
            }
            //点击左侧菜单时添加样式
            .active{
                border-left: 5rpx solid #EF250F;
                font-weight: bold;
                font-size: 32rpx;
                color: #000000;
            }
        }
        //右边内容区域样式
        .right_content{
            flex: 8;
            padding-left: 30rpx;
            background-color: #ffffff;
            .goods_group{
                border-left: 2rpx solid #f9f9f9;
                border-top: 5rpx solid #f9f9f9;
                padding-bottom: 20rpx;
                .goods_title{
                    display: flex;
                    align-items: center;
                    height: 80rpx;
                    color: #2F2F2F;
                    font-weight: bold;
                }
                .goods_list{
                    display: flex;
                    flex-wrap: wrap;
                    navigator{
                        display: flex;
                        flex-direction: column;
                        justify-content: center;
                        align-items: center;
                        width: 33.33%;
                        image{
                            width: 60%;
                        }
                        .goods_name{
                            display: flex;
                            align-items: center;
                            height: 80rpx;
                            font-size: 24rpx;
                        }
                    }
                }
            }
        }
    }
}

